<script setup lang='ts'>
import FlvJs from 'flv.js'

// import DPlayer from 'dplayer'

import 'mui-player/dist/mui-player.min.css'
import MuiPlayer from 'mui-player'
import { GetVideo } from '@/api/index'

// const dplayer = ref<DPlayer | null>(null)

// async function fetchMediaData() {
//   const url = 'http://223.15.235.90:19103/api/dict/media/play?appkey=CB5951D21C2942DC91AB8118C2597454'
//   const bodyData = {
//     parmdata: {
//       memberkey: 'MB0flzYgPj8TNGW0YQ44Qg==',
//       accesstype: 1,
//       deviceid: '14010002031320000059'
//     },
//     sign: 'D5317DB639F6E67A4E332E4B6CDBF14A'
//   }

//   try {
//     const response = await fetch(url, {
//       method: 'POST',
//       headers: {
//         'Content-Type': 'application/json'
//       },
//       body: JSON.stringify(bodyData)
//     })

//     if (!response.ok)
//       throw new Error(`HTTP error! status: ${response.status}`)

//     const data = await response.json() // 假设API返回的是JSON格式数据
//     console.log(data) // 在这里处理你的数据
//   }
//   catch (error) {
//     console.error('Fetching error:', error)
//   }
// }

async function getVideo() {
  const res = await GetVideo()
  if (res.code === 0 && res.data.flvuri) {
    const mp = new MuiPlayer({
      container: '#mui-player',
      src: res.data.flvuri,
      // src: 'https://flvplayer.js.org/assets/video/weathering-with-you.flv',
      muted: true,
      autoplay: true,
      parse: {
        type: 'flv',
        loader: FlvJs,
        config: {
          cors: true,
          hasAudio: false
        }
      }
    })
    // const options = {
    //   container: document.getElementById('dplayer'),
    //   video: {
    //     url: res.data.flvuri,
    //     type: 'flv',
    //     pluginOptions: {
    //       flv: {
    //         // refer to https://github.com/bilibili/flv.js/blob/master/docs/api.md#flvjscreateplayer
    //         mediaDataSource: {
    //           // mediaDataSource config
    //           type: 'flv',
    //           isLive: true,
    //           cors: true,
    //           hasAudio: false,
    //           url: res.data.flvuri
    //         },
    //         config: {
    //         }
    //       }
    //     }
    //     // url: 'https://flvplayer.js.org/assets/video/weathering-with-you.flv'
    //     // url: 'https://media.w3.org/2010/05/sintel/trailer.mp4'
    //   }
    // }
    // dplayer.value = new DPlayer(options)
  }
}

onMounted(() => {
  getVideo()
  // nextTick(() => {
  // })
})
</script>

<template>
  <!-- <div id="dplayer"></div> -->
  <div id="mui-player"></div>
</template>

<style scoped>
</style>
